<template>
  <div ref="myDiv" class="radar-echart"></div>
</template>

<script>
import * as Echarts from "echarts";
import Linechart from "./linechart";
import Linecharts from "./linecharts";
export default {
  name: "Linechart",
  data() {
    return {
      showIndex: "0",
    };
  },
  mounted() {
    this.echarts = Echarts.init(this.$refs.myDiv);

    // this.initData();
    if (this.showIndex === "0") {
      this.echarts.setOption(Linechart);
    }
    if (this.showIndex === "1") {
      this.echarts.setOption(Linecharts);
    }
  },
  watch: {
    showIndex(xin, jiu) {
      // console.log(xin, jiu);
      this.initData();
    },
  },
  methods: {
    initData() {
      if (this.showIndex === "0") {
        this.echarts.setOption(Linechart);
      }
      if (this.showIndex === "1") {
        this.echarts.setOption(Linecharts);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.radar-echart {
  width: 865px;
  height: 295px;
}
</style>
